// 表格

.common-table-wrap {
  margin-top: 12px;
  position: relative;
  padding: 10px 12px 44px;
  background-color: #fff;
  border-radius: 10px;
  height: 100%;

  &.shadow {
    box-shadow: 0 5px 14px 0 rgb(0 0 0 / 10%);
  }

  &.transparent {
    background-color: transparent;
    padding: 0;
  }
}

.common-table {
  position: relative;
  height: 100%;

  .t-table__header--fixed:not(.t-table__header--multiple) > tr > th {
    background-color: #eef2f7;
    line-height: 16px;
    color: #31373d;
    border-bottom: none;

    & + th {
      border-left: 3px solid #fff;
    }
  }

  &.t-table th,
  &.t-table td {
    border-color: #e6e8eb;
    line-height: 16px;
    font-size: 14px;
    padding: 9px 0;
  }
}

.common-table-row {
  width: 100%;
}

.common-table-card {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.common-options {
  display: inline-flex;
  align-items: center;
  gap: 12px;

  .item {
    display: inline-flex;
    color: var(--td-brand-color);
    align-items: center;
    gap: 4px;
    position: relative;
    cursor: pointer;

    &.disabled {
      cursor: not-allowed;

      &:hover {
        opacity: 1;
      }

      .icon,
      .link {
        color: #bbbdbf;
        cursor: not-allowed;
      }

      .link {
        &::after {
          border-bottom-color: #bbbdbf;
        }
      }
    }

    &:hover {
      opacity: 0.8;
    }

    & + .item {
      margin-left: 16px;

      &::before {
        content: '';
        width: 2px;
        height: 100%;
        background-color: var(--td-brand-color);
        position: absolute;
        left: -16px;
        top: 0;
        cursor: auto;
      }
    }

    .icon {
      height: 16px;
      width: 16px;
      color: #0f64ff;
    }

    .link {
      font-size: 14px;
    }
  }
}
